<template>
	<view class="warp" :style="{ minHeight: screenHeight + 'px' }">
		<view class="head" v-if="order_type == 1">
			<view class="status">等待买家付款</view>
			<u-count-down :timestamp="2000000"></u-count-down>后自动关闭
		</view>

		<!-- <view class="pay_text">
			买家已付款
		</view> -->

		<scroll-view scroll-y="true" show-scrollbar="false" class="swiper_wrap" v-if="order_type == 1">
			<view class="address">
				<image class="dingwei" :src="iconurl + '/static/newImg/address.png'"></image>
				<view class="textbox">
					<view class="title">
						{{ detailData.address }}
					</view>
					<view class="info_box">
						<text class="name">{{ detailData.name }}</text>
						<text class="telphone">{{ detailData.mobile }}</text>
					</view>
				</view>
			</view>
			<view class="goods-wrap">
				<view class="goods" style="padding-top: 20rpx" v-for="(item, index) in detailData.goods_list"
					:key="index">
					<view class="img">
						<image :src="item.goods_pic" mode="aspectFill"></image>
					</view>
					<view class="info">
						<text class="name">{{ item.goods_name }}</text>
						<view class="box_num">
							<view class="box_num_left">
								￥<text class="guige">{{ item.total_price }}</text>
							</view>
							<text class="number">x{{ item.num }}</text>
						</view>
					</view>
				</view>
			</view>

			<!-- <view class="order-wrap" v-if="order_type == 3">
				<view class="tit">物流信息</view>
				<view class="block">
					<text class="txt">物流公司：{{detailData.express}}</text>
				</view>
				<view class="block">
					<text class="txt">物流编号:{{detailData.express_no}}</text>
				</view>
			</view>-->

			<view class="order-wrap">
				<view class="block">
					<text class="txt">实付运费：</text>
					<text>￥{{ detailData.pay_price }}</text>
				</view>
				<view class="block">
					<text class="txt">订单编号：</text>
					<text>{{ detailData.order_no }}</text>
					<text class="fuz" @click="fuz(detailData.order_no)">复制</text>
				</view>
				<view class="block">
					<text class="txt">创建时间：</text>
					<text>{{ detailData.create_time }}</text>
				</view>
			</view>
		</scroll-view>

		<view v-if="order_type == 3">
			<view class="address">
				<image class="dingwei" :src="iconurl + '/static/newImg/address.png'"></image>
				<view class="textbox">
					<view class="title">
						{{ detailData.address }}
					</view>
					<view class="info_box">
						<text class="name">{{ detailData.name }}</text>
						<text class="telphone">{{ detailData.mobile }}</text>
					</view>
				</view>
			</view>
			<view class="goods-wrap" v-for="(it, index) in packageList" :key="index">
				<view class="wuliu_title"> 包裹{{ index + 1 }} </view>
				<view class="goods" style="padding-top: 20rpx" v-for="(item, index) in it.detail" :key="index">
					<view class="img">
						<image :src="item.pic" mode="aspectFill"></image>
					</view>
					<view class="info">
						<text class="name">{{ item.goods_name }}</text>
						<view class="box_num">
							<view class="box_num_left">
								￥<text class="guige">{{ item.total_price }}</text>
							</view>
							<text class="number">x{{ item.num }}</text>
						</view>
					</view>
				</view>
				<view class="order-wrap" v-if="order_type == 3">
					<!-- <view class="tit">物流信息</view> -->
					<view class="block">
						<text class="txt">物流公司：{{ it.express_name }}</text>
					</view>
					<view class="block">
						<text class="txt">物流编号:{{ it.express_no }}</text>
						<text class="fuz" @click="fuz(it.order_no)">复制</text>
					</view>
				</view>
			</view>

			<view class="order-wrap">
				<view class="block">
					<text class="txt">实付运费：</text>
					<text>￥{{ detailData.pay_price }}</text>
				</view>
				<view class="block">
					<text class="txt">订单编号：</text>
					<text>{{ detailData.order_no }}</text>
					<text class="fuz" @click="fuz(detailData.order_no)">复制</text>
				</view>
				<view class="block">
					<text class="txt">创建时间：</text>
					<text>{{ detailData.create_time }}</text>
				</view>
				<view class="block">
					<text class="txt">付款时间：</text>
					<text>{{ detailData.pay_time }}</text>
				</view>
				<view class="block">
					<text class="txt">成交时间：</text>
					<text>{{ detailData.send_time }}</text>
				</view>
			</view>
		</view>

		<view v-if="order_type == 0 || order_type == 2 || order_type == 4">
			<view class="address">
				<image class="dingwei" :src="iconurl + '/static/newImg/address.png'"></image>
				<view class="textbox">
					<view class="title">
						{{ detailData.address }}
					</view>
					<view class="info_box">
						<text class="name">{{ detailData.name }}</text>
						<text class="telphone">{{ detailData.mobile }}</text>
					</view>
				</view>
			</view>
			<view class="goods-wrap">
				<view class="goods" style="padding-top: 20rpx" v-for="(item, index) in detailData.goods_list"
					:key="index">
					<view class="img">
						<image :src="item.goods_pic" mode="aspectFill"></image>
					</view>
					<view class="info">
						<text class="name">{{ item.goods_name }}</text>
						<view class="box_num">
							<view class="box_num_left">
								<!-- "<text class="guige" v-for="(it,arri) in item.attr" :key="arri">{{it.attr_name}}</text>" -->
								￥<text class="guige">{{ item.total_price }}</text>
							</view>
							<text class="number">x{{ item.num }}</text>
						</view>
						<!-- <view class="box_chima">
							<text class="guige"></text>
							<text class="price">￥{{item.total_price}}</text>
						</view> -->
					</view>
				</view>
			</view>
			<!-- <view class="other">
				<view class="pay_price">
					实付：
					<text >￥{{detailData.pay_price}}</text>
				</view>
			</view> -->
			<view class="order-wrap">
				<!-- <view class="tit">订单信息</view> -->
				<view class="block">
					<text class="txt">实付运费：</text>
					<text>￥{{ detailData.pay_price }}</text>
				</view>
				<view class="block">
					<text class="txt">订单编号：</text>
					<text>{{ detailData.order_no }}</text>
					<text class="fuz" @click="fuz(detailData.order_no)">复制</text>
				</view>
				<view class="block">
					<text class="txt">创建时间：</text>
					<text>{{ detailData.create_time }}</text>
				</view>
				<!-- <view class="block">
					<text class="txt">支付方式：</text>
					<text>{{detailData.pay_type}}</text>
				</view> -->
				<view class="block" v-if="order_type == 3">
					<text class="txt">付款时间：</text>
					<text>{{ detailData.pay_time }}</text>
				</view>
				<view class="block" v-if="order_type == 3">
					<text class="txt">成交时间：</text>
					<text>{{ detailData.send_time }}</text>
				</view>
				<view class="block" v-if="order_type == 4">
					<text class="txt">取消时间：</text>
					<text>{{ detailData.send_tuihuan }}</text>
				</view>
				<!-- 	<view class="block">
					<text class="txt">运费：</text>
					<text v-if="detailData.express_price==0">免运费</text>
					<text v-else>{{detailData.express_price}}</text>
				</view> -->
			</view>
		</view>

		<view class="head_btn" v-if="order_type == 1">
			<view class="flexs" @click.stop="gosbumit(1, detailData.order_id)"> 取消订单 </view>
			<view class="flexs" @click.stop="gosbumit(2, detailData.order_id)"> 立即支付 </view>
		</view>

		<u-popup v-model="payshow" mode="center" border-radius="20" :closeable="true">
			<view class="popup">
				<view class="popsec">
					<view class="toptwo" @click="fukuancheck(1)" v-if="walletData.weixin_pay_status == 'on'">
						<view class="left">
							<image :src="iconurl + '/static/mall/wx.png'" mode=""></image>
							<text>微信</text>
						</view>
						<image :src="iconurl + '/static/newImg/weixuan.png'" v-if="ptype != 1" @click="fukuancheck(1)">
						</image>
						<image :src="iconurl + '/static/newImg/yes.png'" v-if="ptype == 1" @click="fukuancheck(1)">
						</image>
					</view>
					<!-- #ifdef APP-PLUS -->
					<view class="toptwo" @click="fukuancheck(2)" v-if="walletData.alipay_status == 'on'">
						<view class="left">
							<image src="https://pd.pdaxiang.com/upload/static/mall/zfb.png" mode=""></image>
							<text>支付宝</text>
						</view>
						<image :src="iconurl + '/static/newImg/weixuan.png'" v-if="ptype != 2" @click="fukuancheck(2)">
						</image>
						<image :src="iconurl + '/static/newImg/yes.png'" v-if="ptype == 2" @click="fukuancheck(2)">
						</image>
					</view>
					<!-- #endif -->
				</view>
				<view class="popfoot" @click="opensubmit"><text>确定</text></view>
			</view>
		</u-popup>
		<u-modal v-model="quxiaoStatus" content="确定取消交易吗?" :show-cancel-button="true" @confirm="payConfirm_quxiao">
		</u-modal>
		<u-popup mode="center" v-model="urlpayStatus">
			<view class="webcenter">
				<!-- <web-view  :src="payurl" style="width: 400rpx;height: 400rpx;"></web-view> -->
				结算
			</view>
		</u-popup>
	</view>
</template>

<script>
	import wxPopupFahuo from '@/components/wx_pay/wx_pay_popup.vue'
	export default {
		components: {
			wxPopupFahuo
		},
		data() {
			return {
				payurl: '',
				order_id: '',
				getjieguodingshi: null,
				urlpayStatus: false,
				ptype: 1,
				payshow: false,
				quxiaoStatus: false,
				screenHeight: '',
				info: {},
				timestamp: 0,
				goods_list: [],
				detailData: {},
				walletData: {}, //余额
				order_type: 0,
				iconurl: this.$configs.urls,
				packageList: [],
				statusStr: '',
				code: '',
				codeUrl: ''
			}
		},
		onLoad(option) {
			this.order_type = option.order_type
			if (option.statusStr == '待付款') {
				this.statusStr = option.statusStr
				this.order_type = 1
			}
			this.order_id = option.order_id
			uni.getSystemInfo({
				success: res => {
					this.screenHeight = res.windowHeight
				}
			})
			// this.orderDetail({
			// 	order_id: option.order_id
			// });
			this.getlist()
			this.getwallet() //钱包
		},
		onShow() {
			// #ifdef MP-WEIXIN
			this.getcode()
			// #endif
			// ////console.log('ppppppppppppppp')
			// this.getlist()
			// this.getwallet() //钱包
		},
		methods: {
			getcode() {
				let that = this
				uni.login({
					provider: 'weixin',
					success: function(res) {
						that.code = res.code
					}
				})
			},
			getwallet() {
				this.$Request.get(this.$api.user.wallet).then(res => {
					this.walletData = res.data
					if (res.data.weixin_pay_status == 'on') {
						this.ptype = 1
						return
					}
					if (res.data.alipay_status == 'on') {
						this.ptype = 2
						return
					}
				})
			},
			getjieguo() {
				let data = {
					order_id: this.order_id
				}
				this.$Request.get(this.$api.index.payResult, data).then(res => {
					if (res.data.is_pay == 1) {
						clearInterval(this.getjieguodingshi)
						this.urlpayStatus = false
						setTimeout(() => {
							this.payshow = false
							uni.navigateBack({
								delta: 1
							})
						}, 800)
						clearTimeout();
					}
				})
			},
			//选择收货地址
			diycity() {
				uni.navigateTo({
					url: '/userPage/user/address/address?type=1'
				})
			},
			payConfirm_quxiao() {
				let data = {
					order_id: this.order_id
				}
				this.$Request.get(this.$api.mall.cancel, data).then(res => {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					})
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						})
					}, 1000)
					clearTimeout();
				})
			},
			gosbumit(is, order_id) {
				this.order_id = order_id
				if (is == 1) {
					//取消交易
					this.quxiaoStatus = true
				} else {
					//支付
					this.payshow = true
				}
			},
			tuihuo(item) {
				uni.navigateTo({
					url: '/pages/fenlei/aRefund?goodslist=' + JSON.stringify(item)
				})
			},
			//确定支付
			opensubmit() {
				// #ifdef APP-PLUS
				var data = {
					order_id: this.order_id,
					pay_type: this.ptype,
					is_repeat_pay: 1
				}
				// #endif
				// #ifdef MP-WEIXIN
				var data = {
					js_code: this.code,
					order_id: this.order_id,
					pay_type: this.ptype,
					is_xwechat: 1,
					wechat_type: uni.getStorageSync('wechat_type'),
				}
				// #endif

				this.$Request.get(this.$api.order.sendPayData, data).then(res => {
					if (res.data.status == 0) {
						//调用微信或者支付宝
						this.payurl = res.data.pay_data
						this.order_id = res.data.order_id
						this.Payment(res.data.pay_data)
					} else if (res.data.status == 1) {
						//已支付
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 1500
						})
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							})
						}, 1600)
						clearTimeout();
					}
				})
			},
			Payment(pay_data) {
				let provider = ''
				if (this.ptype == 1) {
					provider = 'wxpay'
				} else {
					provider = 'alipay'
				}
				//调用支付
				let that = this
				uni.requestPayment({
					provider: provider,
					// #ifdef APP-PLUS
					orderInfo: pay_data,
					// #endif
					// #ifdef MP-WEIXIN
					timeStamp: pay_data.timeStamp,
					nonceStr: pay_data.nonceStr,
					signType: 'MD5',
					package: pay_data.package,
					paySign: pay_data.paySign,
					// #endif
					success() {
						uni.showToast({
							title: '支付成功',
							icon: 'none'
						})
						uni.navigateBack({
							delta: 1
						})
					},
					fail(res) {
						that.payshow = false
						uni.showToast({
							title: '支付失败',
							icon: 'none'
						})
						return false
					}
				})
			},
			apipay(order_no, orderInfo) {
				let pay_id = ''
				let provider = ''
				if (this.ptype == 2) {
					pay_id = 1
					provider = 'alipay'
				} else {
					pay_id = 2
					provider = 'wxpay'
				}
				let data = {
					order_no: order_no,
					pay_id: pay_id
				}
				////console.log(11, data)
				// pay(data).then(res => {
				//调用支付
				uni.requestPayment({
					provider: provider,
					orderInfo: orderInfo,
					success(res) {
						////console.log(res)
						// //存入下标作为进入我的订单状态
						// uni.setStorageSync('jumpTo', 2);
						this.payshow = false
						uni.navigateBack({
							delta: 1
						})
					},
					fail(res) {
						////console.log(res)
					}
				})
				// });
			},
			fukuancheck(ptype) {
				this.ptype = ptype
			},
			getlist() {
				let data = {
					order_id: this.order_id
				}
				this.$Request.get(this.$api.order.sendOrderDetail, data).then(res => {
					////console.log(res.data,"时间")
					this.detailData = res.data
					this.packageList = res.data.package_list
					if (
						this.detailData.is_cancel == 0 &&
						this.detailData.is_pay == 0 &&
						this.detailData.sp_time == 0
					) {
						let data = {
							order_id: this.order_id
						}
						this.$Request.get(this.$api.mall.cancel, data).then(res => {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 1000)
							clearTimeout();
						})
					}
				})
			},
			goWuliu(order_id, pic) {
				uni.navigateTo({
					url: '/pages/order/wuliu?order_id=' + order_id + '&pic=' + pic
				})
			},
			shouhou(order_detail_id) {
				uni.navigateTo({
					url: '/pagesA/pages/order/returnGoods?order_detail_id=' + order_detail_id
				})
			},
			goFukuan() {
				this.payshow = true
			},
			fuz(order_no) {
				uni.setClipboardData({
					data: order_no,
					success: res => {
						uni.showToast({
							icon: 'none',
							duration: 500,
							title: '复制成功！'
						})
					}
				})
			},
			goGoods(goods_id) {
				uni.navigateTo({
					url: '/mallPage/mall/goodsdetail?goods_id=' + goods_id
				})
			},

			goEvaluate() {
				uni.navigateTo({
					url: '/pagesA/pages/order/evaluate?order_id=' + this.info.order_id
				})
			},
			goReturn(goodsId) {
				uni.navigateTo({
					url: './returnGoods?goodsId=' + goodsId
				})
			},
			//确认收货
			confirm(order_id) {
				this.Shouhuoshow = true
			}
		}
	}
</script>

<style lang="scss" scoped>
	.warp {
		background: #f9fafd;
		padding: 30rpx 0;
	}

	.wrsp {
		background-color: #fafafa;
		width: 100%;
		height: 100%;
		padding: 40rpx 20rpx 0;
	}

	.swiper_wrap {
		width: 100%;
		height: calc(100vh - 143rpx - 140rpx - 90rpx);
		margin-bottom: 30rpx;
	}

	.popup {
		height: 584rpx;
		width: 640rpx;
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		.delete {
			width: 48rpx;
			height: 48rpx;
			position: absolute;
			right: 20rpx;
			top: 20rpx;
		}

		.popfoot {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 486rpx;
			height: 80rpx;
			background: #6792dd;
			opacity: 1;
			border-radius: 40rpx;
			margin: 50rpx 0;
			color: #ffffff;
		}

		.popsec {
			width: 100%;
			display: flex;
			flex-direction: column;
			margin-top: 60rpx;
			padding-right: 40rpx;
			padding-left: 60rpx;

			.topone {
				width: 610rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;

				image {
					width: 46rpx;
					height: 46rpx;
					margin-right: 30rpx;
					position: relative;
					top: 12upx;
				}

				text {
					color: #999999;
					font-size: 34rpx;
				}
			}

			.toptwo {
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-top: 28rpx;

				image {
					width: 46rpx;
					height: 46rpx;
					margin-right: 30rpx;
					position: relative;
					top: 12upx;
				}

				text {
					color: #999999;
					font-size: 34rpx;
				}
			}
		}
	}

	.head {
		// display: flex;
		// justify-content: center;
		// flex-direction: column;
		// align-items: center;
		width: 710rpx;
		height: 143rpx;
		background-color: #ffffff;
		padding: 22rpx;
		margin: 0 auto 30rpx;
		// box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);

		.status {
			font-size: 36rpx;
			font-weight: 600;
			color: #eb751e;
			margin-bottom: 20rpx;
		}

		.time {
			font-size: 24rpx;
			color: #000;
		}
	}

	.address {
		width: 710rpx;
		height: 143rpx;
		background: white;
		// box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
		border-radius: 20rpx;
		display: flex;
		align-items: center;
		margin: 0 auto;

		.dingwei {
			width: 49rpx;
			height: 49rpx;
			border-radius: 50%;
			margin-left: 15rpx;
			margin-right: 20rpx;
		}

		.text {
			font-size: 30rpx;
			font-weight: bold;
			color: #141414;
		}

		.textbox {
			font-size: 30rpx;
			font-weight: bold;
			color: #141414;

			.title {
				font-size: 30rpx;
				font-weight: bold;
				color: #141414;
				margin: 0;
				width: 620rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.info_box {
				font-size: 24rpx;
				font-weight: 500;
				color: #939393;
				margin-top: 20rpx;

				.name {
					margin-right: 20rpx;
				}
			}
		}
	}

	.dw_bom {
		width: 710rpx;
		margin: 0 auto;
		margin-top: -20rpx;

		image {
			width: 710rpx;
			height: 8rpx;
		}
	}

	// .address-wrap {
	// 	width: 710rpx;
	// 	margin: 0 auto;
	// 	background: #fff;
	// 	padding: 27rpx 20rpx 18rpx 20rpx;
	// 	display: flex;
	// 	align-items: center;
	// 	justify-content: space-between;

	// 	.top {
	// 		font-size: 28rpx;
	// 		color: #333;
	// 		display: flex;
	// 		justify-content: space-between;
	// 		flex-direction: column;

	// 		.top_left {
	// 			image {
	// 				width: 50rpx;
	// 				height: 50rpx;
	// 				vertical-align: middle;
	// 			}

	// 			.name {
	// 				padding: 0 27rpx 0 15rpx;
	// 			}
	// 		}
	// 	}

	// 	.address {
	// 		padding-top: 18rpx;
	// 		font-size: 28rpx;
	// 		line-height: 40rpx;
	// 		color: #333333;
	// 	}
	// }

	.goods-wrap {
		width: 710rpx;
		margin: 0 auto;
		margin: 20rpx;
		// box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
		border-radius: 20rpx;

		.wuliu_title {
			margin: 20rpx 0;
			font-size: 34rpx;
			font-weight: bold;
		}

		.shop {
			color: #333;
			font-size: 30rpx;
			line-height: 42rpx;
			padding: 24rpx 20rpx 30rpx 20rpx;

			image {
				width: 30rpx;
				height: 30rpx;
				vertical-align: middle;
				margin-right: 8rpx;
			}
		}

		.goods {
			display: flex;
			background: #fff;
			padding: 0 20rpx 32rpx 20rpx;
			margin-bottom: 27rpx;
			border-radius: 20rpx;

			.img {
				width: 260rpx;
				height: 260rpx;
				border-radius: 10rpx;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.info {
				margin-left: 20rpx;
				display: flex;
				flex-direction: column;
				padding: 0 20rpx 0 0;
				box-sizing: border-box;
				min-width: 400rpx;

				.box_chima {
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-top: 10rpx;

					.guige {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #333333;
					}

					.price {
						font-size: 40rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #ff0000;
					}
				}

				.box_num {
					display: flex;
					justify-content: space-between;
					align-items: center;
					margin-top: 28rpx;

					.box_num_left {
						display: flex;
						flex-wrap: wrap;
						color: #f46e13;
						font-size: 40rpx;

						.guige {
							font-family: PingFang SC;
							font-weight: 400;
						}
					}

					.number {
						font-size: 26rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #333333;
					}
				}

				.name {
					max-width: 340rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #000000;
					margin-top: 6rpx;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
					text-align: justify;
					overflow: hidden;
					margin-top: 40rpx;
				}

				.cont {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #e80303;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
					text-align: justify;
					overflow: hidden;
					padding-right: 20rpx;
					box-sizing: border-box;
				}

				.bom {
					min-width: 320rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-top: 2rpx;

					.left {
						display: flex;
						align-items: center;

						text:nth-child(1) {
							font-size: 24rpx;
							font-family: PingFang SC;
							font-weight: 500;
							color: #000000;
						}
					}

					.right {
						font-size: 29rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #ffffff;
						text-align: center;
						line-height: 24rpx;
						background: #fd8e1b;
						border-radius: 10rpx;
						padding: 16rpx 26rpx 16rpx 26rpx;
					}
				}
			}
		}

		.division-line {
			border-bottom: 1rpx solid #dfdfdf;
		}
	}

	.other {
		padding: 30rpx 20rpx 52rpx 20rpx;
		background: #fff;
		border-radius: 20rpx;

		.block {
			color: #333;
			display: flex;
			padding-bottom: 29rpx;

			.tit {
				flex: 1;
				line-height: 42rpx;
				font-weight: 700;
			}

			.txt {
				flex: 1;
				line-height: 42rpx;
				text-align: right;
				padding-right: 8rpx;
			}

			.img {
				margin-top: 3rpx;
				width: 12rpx;
				height: 23rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}
		}

		.pay_price {
			text-align: right;
			line-height: 50rpx;
			font-size: 30rpx;

			text {
				color: #ff0000;
				font-size: 42rpx;
			}
		}

		.jifen {
			width: 710rpx;
			margin: 0 auto;
			background: #fceee5;
			line-height: 75rpx;
			color: #ff6505;
			padding-left: 24rpx;
			border-radius: 10rpx;
			padding-top: 49rpx;
		}
	}

	.order-wrap {
		width: 710rpx;
		margin: 0 auto;
		background: #fff;
		padding: 30rpx 40rpx;
		color: #333;
		margin-bottom: 70rpx;
		// box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.16);
		border-radius: 20rpx;

		.tit {
			font-size: 30rpx;
			line-height: 42rpx;
			font-weight: 700;
		}

		.block {
			display: flex;
			justify-content: space-between;
			padding-top: 34rpx;

			&:nth-child(1) {
				padding-top: 0;
			}

			.txt {
				color: #000;
			}

			.fuz {
				width: 98rpx;
				color: #f46d13;
				text-align: center;
				font-size: 24rpx;
				border: 1rpx solid #f46d13;
				border-radius: 23rpx;
			}
		}
	}

	.head_btn {
		width: 750rpx;
		height: 140rpx;
		margin: auto;
		background-color: #ffffff;
		display: flex;
		align-items: center;
		justify-content: space-around;

		view {
			width: 234rpx;
			height: 77rpx;
			border-radius: 39rpx;
			background: #999999;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #ffffff;
			border-radius: 100rpx;
		}

		view:nth-child(2) {
			background: #1289ff;
			// margin-left: 50rpx;
		}
	}

	.bottom-wrap {
		background: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 750rpx;
		min-height: 95rpx;
		padding: 10rpx 10rpx 0 0;

		.btn {
			box-sizing: border-box;
			height: 78rpx;
			line-height: 78rpx;
			text-align: center;
			color: #fff;
			background: #1bbefd;
			text-align: center;
			width: 210rpx;
			border-radius: 10rpx;
			float: right;
			margin-left: 42rpx;
			margin-right: 20rpx;
		}

		.btns {
			background: #fff;
			color: #333;
			border: 1rpx solid #707070;
		}
	}
</style>